<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>存储逻辑测试</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            margin: 20px;
            background-color: #f5f5f5;
        }
        .container {
            max-width: 800px;
            margin: 0 auto;
            background: white;
            padding: 20px;
            border-radius: 8px;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
        }
        .section {
            margin-bottom: 20px;
            padding: 15px;
            border: 1px solid #ddd;
            border-radius: 5px;
        }
        button {
            background: #007bff;
            color: white;
            border: none;
            padding: 10px 20px;
            border-radius: 5px;
            cursor: pointer;
            margin: 5px;
        }
        button:hover {
            background: #0056b3;
        }
        .log {
            background: #f8f9fa;
            padding: 10px;
            border-radius: 3px;
            font-family: monospace;
            white-space: pre-wrap;
            max-height: 300px;
            overflow-y: auto;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>存储逻辑测试</h1>
        
        <div class="section">
            <h3>测试步骤</h3>
            <button onclick="testStorage1()">测试申请1（王老四）</button>
            <button onclick="testStorage2()">测试申请2（林老五）</button>
            <button onclick="testRetrieve1()">获取申请1数据</button>
            <button onclick="testRetrieve2()">获取申请2数据</button>
            <button onclick="clearStorage()">清空存储</button>
        </div>
        
        <div class="section">
            <h3>控制台日志</h3>
            <div id="log" class="log"></div>
        </div>
        
        <div class="section">
            <h3>当前存储数据</h3>
            <div id="storage" class="log"></div>
        </div>
    </div>

    <script>
        let logElement = document.getElementById('log');
        let storageElement = document.getElementById('storage');
        
        function log(message) {
            const timestamp = new Date().toLocaleTimeString();
            logElement.textContent += `[${timestamp}] ${message}\n`;
            logElement.scrollTop = logElement.scrollHeight;
        }
        
        function updateStorage() {
            let storageData = '';
            for (let i = 0; i < sessionStorage.length; i++) {
                const key = sessionStorage.key(i);
                const value = sessionStorage.getItem(key);
                storageData += `${key}: ${value}\n`;
            }
            storageElement.textContent = storageData || '没有数据';
        }
        
        function testStorage1() {
            log('=== 测试申请1（王老四） ===');
            
            // 模拟后端返回的ID
            const businessId1 = 59;
            const storageKey1 = `checkout_approval_data_${businessId1}`;
            
            const approvalData1 = {
                elderlyNo: 'COUT' + Date.now().toString().slice(-4),
                elderlyName: '王老四',
                elderlyIdCard: '110105195202156789',
                contact: '13974060543',
                feePeriod: '2025-10-11 至 2026-10-11',
                careLevel: '三级护理等级',
                bedNumber: 'B114',
                contract: '老人四合同',
                consultant: 'ry',
                caregiver: 'ry',
                checkoutDate: '2025-10-23',
                checkoutReason: '护理质量不高',
                remark: '1212',
                applicantName: 'ry',
                submitTime: '2025-10-23 17:09:28',
                businessId: businessId1
            };
            
            log(`后端返回的ID: ${businessId1}`);
            log(`生成的业务ID: ${businessId1}`);
            log(`使用存储键: ${storageKey1}`);
            
            sessionStorage.setItem(storageKey1, JSON.stringify(approvalData1));
            sessionStorage.setItem('checkout_approval_data', JSON.stringify(approvalData1));
            
            log('数据已保存到sessionStorage');
            updateStorage();
        }
        
        function testStorage2() {
            log('=== 测试申请2（林老五） ===');
            
            // 模拟后端返回的ID
            const businessId2 = 60;
            const storageKey2 = `checkout_approval_data_${businessId2}`;
            
            const approvalData2 = {
                elderlyNo: 'COUT' + Date.now().toString().slice(-4),
                elderlyName: '林老五',
                elderlyIdCard: '330106194708259860',
                contact: '13959320247',
                feePeriod: '2025-10-11 至 2026-10-11',
                careLevel: '等级5',
                bedNumber: 'B121',
                contract: '老人五五开合同',
                consultant: 'user11',
                caregiver: 'user11',
                checkoutDate: '2025-10-23',
                checkoutReason: '费用高昂',
                remark: '151',
                applicantName: 'user11',
                submitTime: '2025-10-23 17:02:55',
                businessId: businessId2
            };
            
            log(`后端返回的ID: ${businessId2}`);
            log(`生成的业务ID: ${businessId2}`);
            log(`使用存储键: ${storageKey2}`);
            
            sessionStorage.setItem(storageKey2, JSON.stringify(approvalData2));
            sessionStorage.setItem('checkout_approval_data', JSON.stringify(approvalData2));
            
            log('数据已保存到sessionStorage');
            updateStorage();
        }
        
        function testRetrieve1() {
            log('=== 获取申请1数据 ===');
            
            const businessId = 59;
            const storageKey = `checkout_approval_data_${businessId}`;
            
            log(`使用业务ID获取数据: ${businessId}`);
            log(`使用存储键: ${storageKey}`);
            
            const checkoutData = sessionStorage.getItem(storageKey);
            log(`从特定存储键获取的数据: ${checkoutData ? '有数据' : '无数据'}`);
            
            if (checkoutData) {
                const data = JSON.parse(checkoutData);
                log(`解析后的表单数据: ${data.elderlyName} - ${data.checkoutReason}`);
                log('使用sessionStorage数据更新表单');
            } else {
                log('特定存储键没有数据，尝试通用存储键');
                const fallbackData = sessionStorage.getItem('checkout_approval_data');
                log(`从通用存储键获取的数据: ${fallbackData ? '有数据' : '无数据'}`);
            }
        }
        
        function testRetrieve2() {
            log('=== 获取申请2数据 ===');
            
            const businessId = 60;
            const storageKey = `checkout_approval_data_${businessId}`;
            
            log(`使用业务ID获取数据: ${businessId}`);
            log(`使用存储键: ${storageKey}`);
            
            const checkoutData = sessionStorage.getItem(storageKey);
            log(`从特定存储键获取的数据: ${checkoutData ? '有数据' : '无数据'}`);
            
            if (checkoutData) {
                const data = JSON.parse(checkoutData);
                log(`解析后的表单数据: ${data.elderlyName} - ${data.checkoutReason}`);
                log('使用sessionStorage数据更新表单');
            } else {
                log('特定存储键没有数据，尝试通用存储键');
                const fallbackData = sessionStorage.getItem('checkout_approval_data');
                log(`从通用存储键获取的数据: ${fallbackData ? '有数据' : '无数据'}`);
            }
        }
        
        function clearStorage() {
            sessionStorage.clear();
            log('存储已清空');
            updateStorage();
        }
        
        // 页面加载时更新存储显示
        window.onload = function() {
            updateStorage();
        };
    </script>
</body>
</html>
